
<div id="content">
  <div class="breadcrumb">
        <a href="http://localhost/opencart/admin/index.php?route=common/home&amp;token=2f1f141ee48d0cbc7cbe3678dd327405">Home</a>
         :: <a href="http://localhost/opencart/admin/index.php?route=catalog/category&amp;token=2f1f141ee48d0cbc7cbe3678dd327405">Category</a>
      </div>
    <div class="box">
    <div class="heading">
      <h1><img src="public/admin/image/category.png" alt="" /> Category</h1>
      <div class="buttons"><a onclick="$('#form').submit();" class="button">Save</a><a href="http://localhost/opencart/admin/index.php?route=catalog/category&amp;token=2f1f141ee48d0cbc7cbe3678dd327405" class="button">Cancel</a></div>
    </div>
    <div class="content">
      <div id="tabs" class="htabs"><a href="#tab-general">General</a><a href="#tab-data">Data</a><a href="#tab-design">Design</a></div>
      <form action="http://localhost/opencart/admin/index.php?route=catalog/category/insert&amp;token=2f1f141ee48d0cbc7cbe3678dd327405" method="post" enctype="multipart/form-data" id="form">
        <div id="tab-general">
          <div id="languages" class="htabs">
                        <a href="#language1"><img src="public/admin/image/flags/gb.png" title="English" /> English</a>
                      </div>
                    <div id="language1">
            <table class="form">
              <tr>
                <td><span class="required">*</span> Category Name:</td>
                <td><input type="text" name="category_description[1][name]" size="100" value="" />
                  </td>
              </tr>
              <tr>
                <td>Meta Tag Description:</td>
                <td><textarea name="category_description[1][meta_description]" cols="40" rows="5"></textarea></td>
              </tr>
              <tr>
                <td>Meta Tag Keywords:</td>
                <td><textarea name="category_description[1][meta_keyword]" cols="40" rows="5"></textarea></td>
              </tr>
              <tr>
                <td>Description:</td>
                <td><textarea name="category_description[1][description]" id="description1"></textarea></td>
              </tr>
            </table>
          </div>
                  </div>
        <div id="tab-data">
          <table class="form">
            <tr>
              <td>Parent:</td>
              <td><input type="text" name="path" value="" size="100" />
                <input type="hidden" name="parent_id" value="0" /></td>
            </tr>
            <tr>
              <td>Filters:<br /><span class="help">(Autocomplete)</span></td>
              <td><input type="text" name="filter" value="" /></td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td><div id="category-filter" class="scrollbox">
                                                    </div></td>
            </tr>
            <tr>
              <td>Stores:</td>
              <td><div class="scrollbox">
                                    <div class="even">
                                        <input type="checkbox" name="category_store[]" value="0" checked="checked" />
                    Default                                      </div>
                                  </div></td>
            </tr>
            <tr>
              <td>SEO Keyword:<br /><span class="help">Do not use spaces instead replace spaces with - and make sure the keyword is globally unique.</span></td>
              <td><input type="text" name="keyword" value="" /></td>
            </tr>
            <tr>
              <td>Image:</td>
              <td valign="top"><div class="image"><img src="http://localhost/opencart/image/cache/no_image-100x100.jpg" alt="" id="thumb" />
                  <input type="hidden" name="image" value="" id="image" />
                  <br />
                  <a onclick="image_upload('image', 'thumb');">Browse</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a onclick="$('#thumb').attr('src', 'http://localhost/opencart/image/cache/no_image-100x100.jpg'); $('#image').attr('value', '');">Clear</a></div></td>
            </tr>
            <tr>
              <td>Top:<br/><span class="help">Display in the top menu bar. Only works for the top parent categories.</span></td>
              <td>                <input type="checkbox" name="top" value="1" />
                </td>
            </tr>
            <tr>
              <td>Columns:<br/><span class="help">Number of columns to use for the bottom 3 categories. Only works for the top parent categories.</span></td>
              <td><input type="text" name="column" value="1" size="1" /></td>
            </tr>
            <tr>
              <td>Sort Order:</td>
              <td><input type="text" name="sort_order" value="0" size="1" /></td>
            </tr>
            <tr>
              <td>Status:</td>
              <td><select name="status">
                                    <option value="1" selected="selected">Enabled</option>
                  <option value="0">Disabled</option>
                                  </select></td>
            </tr>
          </table>
        </div>
        <div id="tab-design">
          <table class="list">
            <thead>
              <tr>
                <td class="left">Stores:</td>
                <td class="left">Layout Override:</td>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td class="left">Default</td>
                <td class="left"><select name="category_layout[0][layout_id]">
                    <option value=""></option>
                                                            <option value="6">Account</option>
                                                                                <option value="10">Affiliate</option>
                                                                                <option value="3">Category</option>
                                                                                <option value="7">Checkout</option>
                                                                                <option value="8">Contact</option>
                                                                                <option value="4">Default</option>
                                                                                <option value="1">Home</option>
                                                                                <option value="11">Information</option>
                                                                                <option value="5">Manufacturer</option>
                                                                                <option value="2">Product</option>
                                                                                <option value="9">Sitemap</option>
                                                          </select></td>
              </tr>
            </tbody>
                      </table>
        </div>
      </form>
    </div>
  </div>
</div>
<script type="text/javascript" src="view/javascript/ckeditor/ckeditor.js"></script> 
<script type="text/javascript"><!--
CKEDITOR.replace('description1', {
	filebrowserBrowseUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405',
	filebrowserImageBrowseUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405',
	filebrowserFlashBrowseUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405',
	filebrowserUploadUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405',
	filebrowserImageUploadUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405',
	filebrowserFlashUploadUrl: 'index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405'
});
//--></script> 
<script type="text/javascript"><!--
$('input[name=\'path\']').autocomplete({
	delay: 500,
	source: function(request, response) {		
		$.ajax({
			url: 'index.php?route=catalog/category/autocomplete&token=2f1f141ee48d0cbc7cbe3678dd327405&filter_name=' +  encodeURIComponent(request.term),
			dataType: 'json',
			success: function(json) {
				json.unshift({
					'category_id':  0,
					'name':  ' --- None --- '
				});
				
				response($.map(json, function(item) {
					return {
						label: item.name,
						value: item.category_id
					}
				}));
			}
		});
	},
	select: function(event, ui) {
		$('input[name=\'path\']').val(ui.item.label);
		$('input[name=\'parent_id\']').val(ui.item.value);
		
		return false;
	},
	focus: function(event, ui) {
      	return false;
   	}
});
//--></script> 
<script type="text/javascript"><!--
// Filter
$('input[name=\'filter\']').autocomplete({
	delay: 500,
	source: function(request, response) {
		$.ajax({
			url: 'index.php?route=catalog/filter/autocomplete&token=2f1f141ee48d0cbc7cbe3678dd327405&filter_name=' +  encodeURIComponent(request.term),
			dataType: 'json',
			success: function(json) {		
				response($.map(json, function(item) {
					return {
						label: item.name,
						value: item.filter_id
					}
				}));
			}
		});
	}, 
	select: function(event, ui) {
		$('#category-filter' + ui.item.value).remove();
		
		$('#category-filter').append('<div id="category-filter' + ui.item.value + '">' + ui.item.label + '<img src="view/image/delete.png" alt="" /><input type="hidden" name="category_filter[]" value="' + ui.item.value + '" /></div>');

		$('#category-filter div:odd').attr('class', 'odd');
		$('#category-filter div:even').attr('class', 'even');
				
		return false;
	},
	focus: function(event, ui) {
      return false;
   }
});

$('#category-filter div img').live('click', function() {
	$(this).parent().remove();
	
	$('#category-filter div:odd').attr('class', 'odd');
	$('#category-filter div:even').attr('class', 'even');	
});
//--></script> 
<script type="text/javascript"><!--
function image_upload(field, thumb) {
	$('#dialog').remove();
	
	$('#content').prepend('<div id="dialog" style="padding: 3px 0px 0px 0px;"><iframe src="index.php?route=common/filemanager&token=2f1f141ee48d0cbc7cbe3678dd327405&field=' + encodeURIComponent(field) + '" style="padding:0; margin: 0; display: block; width: 100%; height: 100%;" frameborder="no" scrolling="auto"></iframe></div>');
	
	$('#dialog').dialog({
		title: 'Image Manager',
		close: function (event, ui) {
			if ($('#' + field).attr('value')) {
				$.ajax({
					url: 'index.php?route=common/filemanager/image&token=2f1f141ee48d0cbc7cbe3678dd327405&image=' + encodeURIComponent($('#' + field).val()),
					dataType: 'text',
					success: function(data) {
						$('#' + thumb).replaceWith('<img src="' + data + '" alt="" id="' + thumb + '" />');
					}
				});
			}
		},	
		bgiframe: false,
		width: 800,
		height: 400,
		resizable: false,
		modal: false
	});
};
//--></script> 
<script type="text/javascript"><!--
$('#tabs a').tabs(); 
$('#languages a').tabs();
//--></script> 
